<template>
  <div>
    <correlationSelect
      v-if="record.options.showType == 'select'"
      :record="record"
      :value="data"
      :formValue="formValue"
      :parentDisabled="parentDisabled"
      :worksheet="worksheet"
      :dynamicData="dynamicData"
      @change="onChange"
    >
    </correlationSelect>

    <correlationCard
      v-else-if="record.options.showType == 'card'"
      :record="record"
      :value="value"
      :formValue="formValue"
      :worksheet="worksheet"
      :parentDisabled="parentDisabled"
      :dynamicData="dynamicData"
      @change="onChange"
    >
    </correlationCard>
    <correlationGrid
      v-else-if="record.options.showType == 'grid'"
      :record="record"
      :value="value"
      :formValue="formValue"
      :worksheet="worksheet"
      :parentDisabled="parentDisabled"
      :dynamicData="dynamicData"
      @change="onChange"
    >
    </correlationGrid>
  </div>
</template>
<script>
import correlationGrid from "./components/grid";
import correlationCard from "./components/card";
import correlationSelect from "./components/select";
export default {
  components: {
    correlationGrid,
    correlationCard,
    correlationSelect,
  },
  data() {
    return {
      data: null,
    };
  },
  watch: {
    value(value) {
      if (value) {
        this.data = value;
      }
    },
  },
  props: [
    "record",
    "value",
    "formValue",
    "parentDisabled",
    "worksheet",
    "dynamicData",
  ],
  methods: {
    onChange(value) {
      this.$emit("change", value);
    },
  },
};
</script>
<style lang="less" scoped></style>
